<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>企业画像</title>
    <link rel="stylesheet" href="../src/css/modal.css">
    <link rel="stylesheet" href="../src/css/index.css">
    <link rel="stylesheet" href="../src/css/qyhx.css">
    <script>
        (function setPageScale(window, document) {
            function setBodyScale() {
                var zoom = (window.innerHeight / 1080).toFixed(3)
                if (document.body) {
                    document.body.style.transform = 'translate(-50%, -50%) scale(' + zoom + ')';
                } else {
                    document.addEventListener('DOMContentLoaded', setBodyScale)
                }
            }
            setBodyScale();
            // reset scale unit on page resize窗口改变时候重新设置缩放
            window.addEventListener('resize', setBodyScale)
            window.addEventListener('pageshow', function (e) {
                if (e.persisted) {
                    setBodyScale()
                }
            })
        }(window, document))
    </script>
    <!--[if lt IE 9]>
        <script src="../src/js/html5shiv.min.js"></script>
        <![endif]-->
</head>

<body>
    <div class="wrapper" id="app">
        <div class="global-content">
            <header class="header">
            </header>
            <section class="main clearfix">
                <nav class="navs">
                    <div class="nav-item">
                        <a href="./tsgz.html" class="tsgz ">
                            态势感知
                        </a>
                    </div>
                    <div class="nav-item">
                        <a href="javascript:;" class="qyhx on">
                            企业画像
                        </a>
                    </div>
                    <div class="nav-item">
                        <a href="./cphx.html" class="cphx">
                            产品画像
                        </a>
                    </div>
                    <div class="nav-item">
                        <a href="./tdpchx.html" class="tdpchx">
                            特定批次
                            画像
                        </a>
                    </div>

                    <div class="nav-item">
                        <a href="./scxszk.html" class="scxszk">
                            生产销售质控
                        </a>
                    </div>
                </nav>
                <div class="content-box ">
                    <div class="ready_container" :class="isReady?'data-ready':''">
                        <div class="content-box-area flex">
                            <div class="cb-left">
                                <div class="stat-1 flex text-center mb10">
                                    <div class="flex-1">
                                        <div class="stat1-title inline-block f19">血液制品</div>
                                        <div>
                                            <div class="circle circle1 inline-block relative">
                                                <div class="item_c"
                                                    :style="{fontSize:stat1.fontSize[stat1.xyzp.qyList.length]}">
                                                    <template v-if="stat1.xyzp.qyList.length>0">
                                                        <div class="qy_item inline-block"
                                                            :class="'width'+stat1.xyzp.qyList.length"
                                                            v-for="item in stat1.xyzp.qyList">
                                                            {{item}}</div>
                                                    </template>
                                                    <template v-else>
                                                        <div class="qy_item inline-block">
                                                            暂无</div>
                                                    </template>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="f16 s-amount">
                                            <span class="qys">企业数：{{stat1.xyzp.qyAmount}}</span>
                                            <span>品种数：{{stat1.xyzp.kindAmount}}</span>
                                        </div>
                                    </div>
                                    <div class="flex-1 stat-1-right">
                                        <div class="stat1-title inline-block f19">疫苗</div>
                                        <div>
                                            <div class="circle circle2 inline-block relative">
                                                <div class="item_c"
                                                    :style="{fontSize:stat1.fontSize[stat1.ym.qyList.length]}">
                                                    <template v-if="stat1.ym.qyList.length>0">
                                                        <div class="qy_item inline-block"
                                                            :class="'width'+stat1.ym.qyList.length"
                                                            v-for="item in stat1.ym.qyList" @click="showQyDetail(item)">
                                                            {{item.name}}</div>
                                                    </template>
                                                    <template v-else>
                                                        <div class="qy_item inline-block">
                                                            暂无</div>
                                                    </template>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="f16 s-amount">
                                            <span class="qys">企业数：{{stat1.ym.qyAmount}}</span>
                                            <span>品种数：{{stat1.ym.kindAmount}}</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="stat-2 mb10">
                                    <div class="s-title">省内疫苗生产企业经济现状</div>
                                    <v-chart :options="stat2.chartOption" class="echart_c_2" />
                                </div>
                                <div class="stat-3">
                                    <div class="s-title">全省疫苗历年总体经济情况</div>
                                    <v-chart :options="stat3.chartOption" class="echart_c_3" />
                                </div>
                            </div>
                            <div class="cb-middle">
                                <div class="stat-4 mb10">
                                    <div class="s-title">企业风险地图</div>
                                    <v-chart :options="stat4.chartOption" class="echart_c_4" />
                                </div>
                                <div class="stat-5" style="background-size:100% 100%; ">
                                    <div class="s-title">企业风险安全排行榜</div>
                                    <div class="table-container">
                                        <table class="text-center f16">
                                            <tr>
                                                <th class="th1">序号</th>
                                                <th class="th2">企业</th>
                                                <th class="th3">风险值/风险等级</th>
                                            </tr>
                                            <template v-for="(item,index) in stat5.qyList">
                                                <tr>
                                                    <td>{{index+1}}</td>
                                                    <td>{{item.name}}</td>
                                                    <td>{{item.level}}</td>
                                                </tr>
                                            </template>
                                        </table>
                                    </div>
                                </div>
                            </div>
                            <div class="cb-right flex-1">
                                <div class="stat-6">
                                    <div class="s-title">最新风险预警信息</div>
                                    <div class="yj-container">
                                        <ul>
                                            <li v-for="item in stat6.yjList">
                                                {{item.name}}
                                            </li>
                                        </ul>
                                    </div>
                                    <div class="yjczfx ellipsis">
                                        <img src="../src/img/qyhx/stat6/icon_voice.png" class="vmd">
                                        <span class="vmd">预警处置风险：{{stat6.yjczfx.name||'暂无'}}</span>
                                    </div>
                                    <img src="../src/img/qyhx/stat6/line.png" class="line">
                                    <div class="form">
                                        <div class="btn-list flex text-center">
                                            <div class="flex-1 tab" @click="showYmDig">信源</div>
                                            <div class="flex-1 tab" @click="showYmDig">模型</div>
                                            <div class="flex-1 tab" @click="showYmDig">企业</div>
                                            <div class="flex-1 tab" @click="showYmDig">产品</div>
                                            <div class="flex-1  ">
                                                <div class="cz-tab-btn">处置</div>
                                            </div>
                                        </div>
                                        <div class="form_content">
                                            <div class="mb20">
                                                <span>会商确定类型：</span>
                                                <select v-model="stat6.form.hsqdlx"
                                                    class="form-control hsqdlx inline-block">
                                                    <option :value="1">预警处置</option>
                                                    <option :value="2">预警处置2</option>
                                                    <option :value="3">预警处置3</option>
                                                </select>
                                            </div>
                                            <div>
                                                <div class="mb10">会商意见：</div>
                                                <textarea v-model="stat6.form.hsyj" class="form-control">

                                                    </textarea>
                                            </div>
                                            <div class="text-right"><button class="submit-btn"
                                                    @click="submitForm">提交</button></div>
                                        </div>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>

                </div>
            </section>
        </div>
        <!--模态窗*************************************-->
        <!--企业风险信息详情-->
        <template v-if="activeDialogIndex==1">
            <div class="modal fade" id="modal1" tabindex="-1" role="dialog" aria-labelledby="exampleModalLongTitle"
                aria-hidden="true">
                <div class="modal-dialog dialog1" role="document">
                    <div class="modal-content ">
                        <div class="modal-header">
                            <h5 class="modal-title">企业风险信息详情</h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button>
                        </div>
                        <div class="modal-body ">
                            <div class="d-content">
                                <div class="fx-item flex mb10">
                                    <div class="fx-label">
                                        <div class="label-name">企业</div>
                                    </div>
                                    <div class="flex-1 ">
                                        <div class="mb10">
                                            <span class="l-name">企业名称：</span>
                                            <span class="color-yellow">{{dialogQyfxx.qyInfo.name}}</span>
                                        </div>
                                        <div>
                                            <span class="l-name">发证日期：</span>
                                            <span>{{dialogQyfxx.qyInfo.fzTime}}</span>
                                        </div>
                                    </div>
                                    <div class="flex-1">
                                        <div class="mb10">
                                            <span class="l-name">许可证编号：</span>
                                            <span>{{dialogQyfxx.qyInfo.xkzbh}}</span>
                                        </div>
                                        <div>
                                            <span class="l-name">有效期至：</span>
                                            <span>{{dialogQyfxx.qyInfo.yxqTime}}</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="fx-item flex mb10">
                                    <div class="fx-label">
                                        <div class="label-name">产品</div>
                                    </div>
                                    <div class="flex-1 ">
                                        <div class="mb10">
                                            <span class="l-name">产品名称：</span>
                                            <span class="color-yellow">{{dialogQyfxx.cpInfo.name}}</span>
                                        </div>
                                        <div>
                                            <span class="l-name">批准日期：</span>
                                            <span>{{dialogQyfxx.cpInfo.pzTime}}</span>
                                        </div>
                                    </div>
                                    <div class="flex-1">
                                        <div class="mb10">
                                            <span class="l-name">批准文号：</span>
                                            <span>{{dialogQyfxx.cpInfo.pzwh}}</span>
                                        </div>
                                        <div>
                                            <span class="l-name">剂型：</span>
                                            <span>{{dialogQyfxx.cpInfo.jx}}</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="fx-item flex mb10">
                                    <div class="fx-label">
                                        <div class="label-name">信源</div>
                                    </div>
                                    <div class="flex-1 flex fx-content">
                                        <div class="flex-1 pl20">
                                            <div class="mb10">
                                                <table class="text-center f16">
                                                    <tr>
                                                        <th style="width: 240px">企业名称</th>
                                                        <th style="width: 240px">许可证编号</th>
                                                        <th style="width: 150px">有效期至</th>
                                                    </tr>
                                                    <template v-for="(item,index) in dialogQyfxx.xkzList">
                                                        <tr>
                                                            <td>{{item.name}}</td>
                                                            <td>{{item.xkzbh}}</td>
                                                            <td>{{item.yxq}}</td>
                                                        </tr>
                                                    </template>
                                                </table>
                                            </div>
                                            <div>
                                                <table class="text-center f16">
                                                    <tr>
                                                        <th style="width: 54px">序号</th>
                                                        <th style="width: 190px">抽检时间</th>
                                                        <th style="width: 255px">不合格项目</th>
                                                    </tr>
                                                    <template v-for="(item,index) in dialogQyfxx.cjList">
                                                        <tr>
                                                            <td>{{index+1}}</td>
                                                            <td>{{item.time}}</td>
                                                            <td>{{item.bhgxm}}</td>
                                                        </tr>
                                                    </template>
                                                </table>
                                            </div>
                                        </div>
                                        <div class="flex-1 pl10">
                                            <div class="mb10">
                                                <table class="text-center f16">
                                                    <tr>
                                                        <th style="width: 54px">序号</th>
                                                        <th style="width: 170px">不良反应时间</th>
                                                        <th style="width: 280px">来源地区</th>
                                                    </tr>
                                                    <template v-for="(item,index) in dialogQyfxx.blfyList">
                                                        <tr>
                                                            <td>{{index+1}}</td>
                                                            <td>{{item.time}}</td>
                                                            <td>{{item.place}}</td>
                                                        </tr>
                                                    </template>
                                                </table>
                                            </div>
                                            <div>
                                                <table class="text-center f16">
                                                    <tr>
                                                        <th style="width: 54px">序号</th>
                                                        <th style="width: 224px">违法行为</th>
                                                        <th style="width: 220px">性质</th>
                                                    </tr>
                                                    <template v-for="(item,index) in dialogQyfxx.wfxwList">
                                                        <tr>
                                                            <td>{{index+1}}</td>
                                                            <td>{{item.wfxw}}</td>
                                                            <td>{{item.xz}}</td>
                                                        </tr>
                                                    </template>
                                                </table>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="fx-item flex mb10">
                                    <div class="fx-label">
                                        <div class="label-name">模型</div>
                                    </div>
                                    <div class="flex-1 pl20">
                                        <div class="mx_content"></div>
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </template>
    </div>

</body>
<script type="text/javascript" src="../src/js/jquery-1.11.1.min.js"></script>
<script src="../src/js/polyfill.min.js"></script>
<script src="../src/js/vue.min.js"></script>
<script src="../src/js/echarts.js"></script>
<script src="../src/js/vue-echarts@4.0.2"></script>
<script src="../src/js/modal.min.js"></script>
<script src="../src/js/chart-options.js"></script>

<script type="text/javascript" src="../src/js/qyhx.js"></script>

</html>